@extends('layouts.app')

@section('content')
<div class="container">
	<div class="row">
		<div class="col-md-5 text-right">
			<form >
				<div class="form-group">
					<button id="beforeone" type="button" class="btn btn-primary">上一题</button>
					<button id="nextone" type="button" class="btn btn-primary">下一题</button>
					<button id="startBtn" value="start" type="button" class="btn btn-primary">开始答题</button>
					<button id="refershinfo" type="button" class="btn btn-primary">刷新</button>
				</div>
			</form>
		</div>
		<div class="col-md-3 text-right">
			<form >
				<div class="form-group">
					<button id="upfontsize" type="button" class="btn btn-default">+</button>
					<button id="downfontsize" type="button" class="btn btn-default">-</button>
				</div>
			</form>
		</div>
	</div>


    <div class="row">
        <div class="col-md-8">
            <div class="panel panel-default" >
				<div id="questionPanel">
					<div name='questions' id="qusetionLabel"  style="margin-left: 10px;margin-right: 10px; font-size: 28px;">题目</div>
					<p name='questions' id="chooseA"  style="margin-left: 10px;margin-right: 10px; font-size: 28px;"></p>
					<p name='questions' id="chooseB"  style="margin-left: 10px;margin-right: 10px; font-size: 28px;"></p>
					<p name='questions' id="chooseC"  style="margin-left: 10px;margin-right: 10px; font-size: 28px;"></p>
					<p name='questions' id="chooseD"  style="margin-left: 10px;margin-right: 10px; font-size: 28px;"></p>
					<div name='questions' id="correctAnswer" style="margin-left: 10px; margin-right: 10px; font-size: 28px; word-break:break-all;"></div>
				</div>

			<div class="span text-right">
				<button id="showAnswer" class="btn btn-default text-right" value="show" style="margin-bottom: 10px;margin-right: 10px;">显示答案</button>
			</div>
			</div>
        </div>
        <div class="col-md-4">
            <div class="panel panel-default" id="answerInfo">
                <h3 style="margin-left: 10px;">答题情况</h3>
                <p id="answerId" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
                <p id="answerCount" class="lead" style="margin-left: 10px;margin-right: 10px; color:#FF3333; font-size:25px; font-weight:bold; "></p>
                <p id="correctRate" class="lead" style="margin-left: 10px;margin-right: 10px; color:#FF3333; font-size:25px; font-weight:bold;"></p>
				<button id="showMore" class="btn btn-default" value="show" style="margin-left: 10px;margin-bottom: 10px;">显示详情</button>
				<div id="moreinfoDiv">
					<p id="fastAnswer" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
					<p id="otherAnsewer" class="lead" style="margin-left: 10px;margin-right: 10px;" hidden>答题详情: </p>
					<div id="otherAnswerDiv" class="span" style=" color:#E63F00; ">
						<p id="otheranslab1" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab2" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab3" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab4" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab5" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab6" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab7" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab8" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab9" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab10" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab11" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab12" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab13" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab14" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab15" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab16" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab17" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab18" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab19" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab20" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab21" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab22" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab23" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab24" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab25" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab26" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab27" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab28" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab29" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab30" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab31" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab32" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab33" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab34" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab35" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab36" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab37" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab38" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab39" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab40" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab41" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab42" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab43" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab44" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab45" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab46" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab47" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab48" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab49" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab50" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab51" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab52" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab53" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab54" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab55" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab56" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab57" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab58" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab59" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab60" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab61" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab62" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
						<p id="otheranslab63" class="lead" style="margin-left: 10px;margin-right: 10px;"></p>
					</div>
				</div>
            </div>
        </div>
    </div>
</div>
@endsection
